<template>
  <div class="app-container">
    <el-form
      label-position="center"
      :model="queryParams"
      ref="queryForm"
      size="small"
      :inline="true"
      v-show="showSearch"
      label-width="100px">
      <el-form-item
        label=""
        prop="id">
        <el-input
          v-model="queryParams.id"
          placeholder="请输入场站编号"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item
        label=""
        prop="stationName">
        <el-input
          v-model="queryParams.stationName"
          placeholder="请输入场站名称"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>

      <!--      <el-form-item
              label=""
              prop="provinceList">
              <el-select
                v-model="queryParams.provinceList"
                @change="changeProvince($event)"
                placeholder="请选择省名称"
                clearable
                size="small">
                <el-option
                  v-for="area in provinceList"
                  :key="area.id"
                  :label="area.regionName"
                  :value="area.id"
                />

              </el-select>
            </el-form-item>
            <el-form-item
              label=""
              prop="cityId">
              <el-select
                v-model="queryParams.cityId"
                @change="changeCity($event)"
                placeholder="请选择市名称"
                clearable
                size="small">
                <el-option
                  v-for="area in cityList"
                  :key="area.id"
                  :label="area.regionName"
                  :value="area.id"
                />
              </el-select>
            </el-form-item>
            <el-form-item
              label=""
              prop="districtId">
              <el-select
                v-model="queryParams.districtId"
                @change="changeDistrict($event)"
                placeholder="请选择县名称"
                clearable
                size="small">
                <el-option
                  v-for="area in districtList"
                  :key="area.id"
                  :label="area.regionName"
                  :value="area.id"
                />
              </el-select>
            </el-form-item>
            <el-form-item
              label=""
              prop="regionId">
              <el-select
                v-model="queryParams.regionId"
                placeholder="请选择街道名称"
                clearable
                size="small">
                <el-option
                  v-for="area in villageNameList"
                  :key="area.id"
                  :label="area.regionName"
                  :value="area.id"
                />
              </el-select>
            </el-form-item>-->
      <el-form-item
        label=""
        prop="agentName">
        <el-select
          filterable
          allow-create
          default-first-option
          v-model="queryParams.agentName"
          placeholder="请选代理商"
          clearable
          size="small">
          <el-option
            v-for="area in agentList"
            :key="area.id"
            :label="area.agentName"
            :value="area.agentName"
          />
        </el-select>
      </el-form-item>
<!--        <el-input
          v-model="queryParams.agentName"
          placeholder="请输入归属代理商"
          clearable
          @keyup.enter.native="handleQuery"
        />-->
      <el-form-item label="" prop="status">
        <el-select v-model="queryParams.status" class="labelWidth" clearable style="width: 150px"
                   placeholder="当前场站状态">
          <el-option
            key="0"
            label="异常"
            value="0">
          </el-option>
          <el-option
            key="1"
            label="正常"
            value="1">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="" prop="isShown">
        <el-select v-model="queryParams.isShown" class="labelWidth" clearable style="width: 150px"
                   placeholder="终端地图显示">
          <el-option
            :key="0"
            label="不显示"
            value="0">
          </el-option>
          <el-option
            :key="1"
            label="显示"
            value="1">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="" prop="timeExport">
        <el-date-picker
          v-model="queryParams.timeExport"
          :default-time="['00:00:00', '23:59:59']"
          align="right"
          clearable
          end-placeholder="建站结束日期"
          range-separator="至"
          start-placeholder="建站开始日期"
          style="width: 270px"
          type="daterange"
          value-format="timestamp"
          @change="timeChange">
        </el-date-picker>
      </el-form-item>
      <el-form-item>
        <el-button
          type="primary"
          icon="el-icon-search"
          size="mini"
          @click="handleQuery">搜索
        </el-button>
        <el-button
          icon="el-icon-refresh"
          size="mini"
          @click="resetQuery">重置
        </el-button>
      </el-form-item>
    </el-form>

    <el-row
      :gutter="10"
      class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-hasPermi="['business:station:add']"
        >新增
        </el-button>
      </el-col>
      <!--      <el-col :span="1.5">
              <el-button
                type="success"
                plain
                icon="el-icon-edit"
                size="mini"
                :disabled="single"
                @click="handleUpdate"
                v-hasPermi="['business:station:edit']"
              >修改
              </el-button>
            </el-col>
            <el-col :span="1.5">
              <el-button
                type="danger"
                plain
                icon="el-icon-delete"
                size="mini"
                :disabled="multiple"
                @click="handleDelete"
                v-hasPermi="['business:station:remove']"
              >删除
              </el-button>
            </el-col>-->
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
          v-hasPermi="['business:station:export']"
        >导出
        </el-button>
      </el-col>
      <right-toolbar
        :showSearch.sync="showSearch"
        @queryTable="getList"></right-toolbar>
    </el-row>

    <el-table
      v-loading="loading"
      :data="stationList"
      @selection-change="handleSelectionChange"
      :stripe="true">
      <el-table-column
        label="场站编号"
        align="center"
        prop="id"
        show-overflow-tooltip/>
      <el-table-column
        label="场站名称"
        align="center"
        prop="stationName"
        show-overflow-tooltip/>
      <el-table-column
        label="归属代理商"
        align="center"
        prop="agentName"
        show-overflow-tooltip/>
      <el-table-column
        label="地址信息"
        align="center"
        prop="addressInfo"
        show-overflow-tooltip/>
      <el-table-column
        label="建站时间"
        align="center"
        prop="createTime">
        <template slot-scope="scope">
          {{ parseTime(scope.row.createTime) }}
        </template>
      </el-table-column>
      <el-table-column
        label="场站状态"
        align="center"
        prop="status">
        <template v-slot="scope">
          <el-tag :type="scope.row.status == 1 ? '' : 'info'">{{ scope.row.status == 1 ? '正常' : '异常' }}</el-tag>
        </template>
      </el-table-column>
      <el-table-column
        label="终端地图显示"
        align="center"
        prop="isShown">
        <template v-slot="scope">
          <el-tag :type="scope.row.isShown? 'success' : 'danger'">{{ scope.row.isShown ? '显示' : '不显示' }}</el-tag>
        </template>
      </el-table-column>
      <el-table-column
        label="装机总数"
        align="center"
        prop="chargeStationSum"
        show-overflow-tooltip/>
      <!--<el-table-column
        label="故障数"
        align="center"
        prop="faultSum"
        show-overflow-tooltip/>-->
      <el-table-column
        label="场站管理员"
        align="center"
        prop="isShown">
        <template v-slot="scope">
          <el-button
            size="mini"
            :class="['text-button', { 'active': active===scope.$index+'handleManger' }]"
            type="text"
            @click="handleManger(scope.row),active=scope.$index+'handleManger'"
            v-hasPermi="['business:station:edit']"
          >管理员列表
          </el-button>
        </template>
      </el-table-column>
      <el-table-column
        label="操作"
        align="center"
        class-name="small-padding fixed-width">
        <template v-slot="scope">
          <el-button
            size="mini"
            :class="['text-button', { 'active': active===scope.$index+'handleUpdate' }]"
            type="text"
            @click="handleUpdate(scope.row),active=scope.$index+'handleUpdate'"
            icon="el-icon-edit"
            v-hasPermi="['business:station:edit']"
          >详情
          </el-button>
          <!--          <el-button
                      size="mini"
                      type="text"
                      icon="el-icon-delete"
                      @click="handleDelete(scope.row)"
                      v-hasPermi="['business:station:remove']"
                    >删除
                    </el-button>-->
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />
    <!-- 添加或修改场站管理对话框 -->
    <el-dialog
      title="管理员列表"
      :visible.sync="mangerOpen"
      width="50%"
      append-to-body>
      <div class="app-container">
        <el-descriptions class="margin-top" title="场站信息" :column="2" border>
          <el-descriptions-item>
            <template slot="label">
              <i class="el-icon-user"></i>
              场站编号
            </template>
            {{ chargeStationId }}
          </el-descriptions-item>
          <el-descriptions-item>
            <template slot="label">
              <i class="el-icon-mobile-phone"></i>
              场站名称
            </template>
            {{ chargeStationName }}
          </el-descriptions-item>
        </el-descriptions>
      </div>

      <station-manger :charge-station-id="chargeStationId"></station-manger>
      <div
        slot="footer"
        class="dialog-footer">
        <el-button @click="mangerOpen = !mangerOpen">退 出</el-button>
      </div>
    </el-dialog>
    <!-- 添加或修改场站管理对话框 -->
    <el-dialog
      :title="title"
      :visible.sync="open"
      width="80%"
      append-to-body>
      <div class="items">
          <el-form
            ref="form"
            :model="form"
            :rules="rules"
            label-width="130px"
            class="formLine">
            <div class="form_l" ref="leftFrom">
              <el-form-item
                label="代理商"
                prop="provinceList">
                <!--          <el-input v-model="form.provinceId" placeholder="请输入省名称"/>-->
                <el-select
                  filterable
                  allow-create
                  default-first-option
                  v-model="form.agentId"
                  @change="changeProvince($event)"
                  placeholder="请选代理商"
                  clearable
                  size="small">
                  <el-option
                    v-for="area in agentList"
                    :key="area.id"
                    :label="area.agentName"
                    :value="area.id"
                  />
                </el-select>
              </el-form-item>
              <el-form-item
                label="场站名称"
                prop="stationName">
                <el-input
                  v-model="form.stationName"
                  placeholder="请输入场站名称"/>
              </el-form-item>
              <el-form-item
                label="省名称"
                prop="provinceList">
                <!--          <el-input v-model="form.provinceId" placeholder="请输入省名称"/>-->
                <el-select
                  filterable
                  allow-create
                  default-first-option
                  v-model="form.province"
                  @change="changeProvince($event)"
                  placeholder="请选择省名称"
                  clearable
                  size="small">
                  <el-option
                    v-for="area in provinceList"
                    :key="area.id"
                    :label="area.regionName"
                    :value="area.id"
                  />
                </el-select>
              </el-form-item>
              <el-form-item
                label="市名称"
                prop="cityId">
                <el-select
                  v-model="form.cityId"
                  @change="changeCity($event)"
                  placeholder="请输入市名称"
                  clearable
                  size="small">
                  <el-option
                    v-for="area in cityList"
                    :key="area.id"
                    :label="area.regionName"
                    :value="area.id"
                  />
                </el-select>
              </el-form-item>
              <el-form-item
                label="区名称"
                prop="districtId">

                <el-select
                  v-model="form.districtId"
                  @change="changeDistrict($event)"
                  placeholder="请输入区名称"
                  clearable
                  size="small">
                  <el-option
                    v-for="area in districtList"
                    :key="area.id"
                    :label="area.regionName"
                    :value="area.id"
                  />
                </el-select>
              </el-form-item>
              <el-form-item
                label="街道名称"
                prop="regionId">
                <el-select
                  v-model="form.regionId"
                  @change="changevillage($event)"
                  placeholder="请输入街道名称"
                  clearable
                  size="small">
                  <el-option
                    v-for="area in villageNameList"
                    :key="area.id"
                    :label="area.regionName"
                    :value="area.id"
                  />
                </el-select>
              </el-form-item>
              <el-form-item
                label="地址信息"
                prop="addressInfo">
                <el-input
                  v-model="form.addressInfo"
                  placeholder="请输入地址信息"/>
              </el-form-item>
              <el-form-item
                label="纬度"
                prop="latitude">
                <el-input
                  v-model="form.latitude"
                  disabled
                  placeholder="请输入纬度"/>
              </el-form-item>
              <el-form-item
                label="经度"
                prop="longitude">
                <el-input
                  v-model="form.longitude"
                  disabled
                  placeholder="请输入经度"/>
              </el-form-item>
              <el-form-item
                label="是否显示在地图"
                prop="longitude">
                <el-radio v-model="form.isShown" :label="0">不显示</el-radio>
                <el-radio v-model="form.isShown" :label="1">显示</el-radio>
              </el-form-item>
            </div>
            <div class="form_r">
              <map-shop ref="mapForm" @getLocation="getLocation" @changeAddress="changeAddress" :indexMap="true"
                        :getLat="getLat" :getLng="getLng" :address="form.addressInfo" :id="id"></map-shop>
            </div>
          </el-form>
        </div>

      <div
        slot="footer"
        class="dialog-footer">
        <el-button
          type="primary"
          @click="submitForm">确 定
        </el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { listStation, getStation, delStation, addStation, updateStation, getAllChildAreaByParentId } from '@/api/business/station'
import { listAgent } from '@/api/platform/agent'
import mapShop from '@/components/Map'
import stationManger from "@/views/business/station/components/stationManger.vue"
const parentStatus = {
  1:'province',
  2:'cityId',
  3:'districtId',
  4:'regionId'
}
export default {
  name: 'Station',
  components: {
    mapShop,
    stationManger
  },
  data () {
    return {
      active: null,
      chargeStationId: '',
      chargeStationName: '',
      id: '',
      getLat: '',
      getLng: '',
      parentList: [],
      map: null,
      markerLayer: null,
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      agentList:[],
      // 场站管理表格数据
      stationList: [],

      //add by zsh
      //省地区列表数据
      provinceList: [],
      //市地区列表数据
      cityList: [],
      //县地区列表数据
      districtList: [],
      //街道地区列表数据
      villageNameList: [],
      //查询地区参数
      parentId: 0,

      mangerOpen: false,
      // 弹出层标题
      title: '',
      // 是否显示弹出层
      open: false,
      // 查询参数
      queryAgentParams: {
        pageNum: 1,
        pageSize: 1000,
      },
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        id: null,
        isShown: null,
        stationName: null,
        addressInfo: null,
        latitude: null,
        longitude: null,
        lastUpdateTime: null,
        status: null,
        version: null,
        provinceId: null,
        city: null,
        cityId: null,
        district: null,
        districtId: null,
        villageName: null,
        regionId: null,
        beginTime: null,
        endTime: null,
        timeExport: null,
      },
      // 表单参数
      form: {
        province: null,
        city: null,
        district: null,
        villageName: null
      },
      // 表单校验
      rules: {
        agentId: [
          { required: true, message: '代理商不能为空', trigger: 'blur' }
        ],
        createTime: [
          { required: true, message: '创建时间不能为空', trigger: 'blur' }
        ],
        stationName: [
          { required: true, message: '场站名称不能为空', trigger: 'blur' }
        ],
        addressInfo: [
          { required: true, message: '地址信息不能为空', trigger: 'blur' }
        ],
        latitude: [
          { required: true, message: '纬度不能为空', trigger: 'blur' }
        ],
        longitude: [
          { required: true, message: '经度不能为空', trigger: 'blur' }
        ],
        regionId: [
          { required: true, message: '区域ID不能为空', trigger: 'blur' }
        ],
        lastUpdateTime: [
          { required: true, message: '最后更新时间不能为空', trigger: 'blur' }
        ],
        status: [
          { required: true, message: '状态不能为空', trigger: 'change' }
        ]
      }
    }
  },
  mounted () {

  },
  created () {
    this.getList()
    this.getAgentList()
    this.getAllChildArea(0)
  },
  methods: {
    timeChange(val) {
      this.queryParams.beginTime = val[0]
      this.queryParams.endTime = val[1]
    },
    changeAddress(e) {
      this.form.addressInfo = e
    },
    getLocation(e) {
      this.form.latitude = e.lat
      this.form.longitude = e.lng
    },
    /** initMap **/
    initMap(latitude, longitude) {
      const _this = this
      const center = new TMap.LatLng(30.33864600881732, 112.22565830821229)
      //初始化地图

      if (!_this.map) {
        this.map = new TMap.Map(document.getElementById('container'), {
          center: center//设置地图中心点坐标
          // zoom: 17.2,   //设置地图缩放级别
          // pitch: 43.5,  //设置俯仰角
          // rotation: 45    //设置地图旋转角度
        })
        //设定marker点及其样式
        _this.markerLayer = new TMap.MultiMarker({
          map: _this.map,  //指定地图容器
          /*geometries: [{
            'id': '1',   //点标记唯一标识，后续如果有删除、修改位置等操作，都需要此id
            'styleId': 'myStyle',  //指定样式id
            'position': center,  //点标记坐标位置
            /!*'properties': {//自定义属性
              'title': '荆州万达广场',
              'imageUrl': './images/兔子1.gif'
            }*!/
          }]*/
        })
      }
      if (latitude&&longitude){
        _this.markerLayer.setGeometries([])
        _this.markerLayer.add({
          position: new TMap.LatLng(latitude, longitude)
        })
      }


      //监听点击事件添加marker
      _this.map.on('click', (evt) => {
        console.log(evt.latLng)
        let { lat, lng } = evt.latLng
        _this.markerLayer.setGeometries([])
        _this.markerLayer.add({
          position: evt.latLng
        })
        _this.form.longitude = lng
        _this.form.latitude = lat
      })
    },
    //省份改变事件
    changeProvince (provinceId) {
      console.log('provinceId==' + provinceId)
      if (provinceId == '') {
        this.cityList = null
        this.districtList = null
        this.villageNameList = null
        //重置市县街道参数
        this.queryParams.cityId = null
        this.queryParams.districtId = null
        this.queryParams.regionId = null

        this.form.cityId = null
        this.form.districtId = null
        this.form.regionId = null
      } else {
        let obj = {}
        obj = this.provinceList.find((item) => {//这里的userList就是上面遍历的数据源
          return item.id === provinceId//筛选出匹配数据
        })
        this.form.province = obj.id
        getAllChildAreaByParentId(provinceId).then(response => {
          this.cityList = response.data
        })
        //重置市县街道参数
        this.queryParams.cityId = null
        this.queryParams.districtId = null
        this.queryParams.regionId = null
        this.form.cityId = null
        this.form.districtId = null
        this.form.regionId = null
      }
    },
    //市份改变事件
    changeCity (cityId) {
      // console.log("cityId==" + cityId)
      if (cityId == '') {
        this.districtList = []
        this.villageNameList = []
        //重置县乡参数
        this.queryParams.districtId = null
        this.queryParams.regionId = null
        this.form.districtId = null
        this.form.regionId = null
      } else {
        let obj = {}
        obj = this.cityList.find((item) => {//这里的userList就是上面遍历的数据源
          return item.id === cityId//筛选出匹配数据
        })
        this.form.city = obj.name
        getAllChildAreaByParentId(cityId).then(response => {
          this.districtList = response.data
        })
        //重置县乡参数
        this.queryParams.districtId = null
        this.queryParams.regionId = null
        this.form.districtId = null
        this.form.regionId = null
      }
    },

    //县份改变事件
    changeDistrict (countyId) {
      // console.log("countyId==" + countyId)
      if (countyId == '') {
        this.villageNameList = null
        //重置乡参数
        this.queryParams.regionId = null
        this.form.regionId = null
      } else {
        let obj = {}
        obj = this.districtList.find((item) => {//这里的userList就是上面遍历的数据源
          return item.id === countyId//筛选出匹配数据
        })
        this.form.district = obj.name
        getAllChildAreaByParentId(countyId).then(response => {
          this.villageNameList = response.data
        })
        //重置乡参数
        this.queryParams.regionId = null
        this.form.regionId = null
      }
    },
    //乡镇改变事件
    changevillage (value) {
      if (value == '') {
        this.queryParams.regionId = null
        this.form.regionId = null
      } else {
        let obj = {}
        obj = this.villageNameList.find((item) => {//这里的userList就是上面遍历的数据源
          return item.id === value//筛选出匹配数据
        })
        // console.log(obj.name);
        this.form.villageName = obj.name
      }
    },
    /** 查询场站管理列表 */
    async getAgentList () {
      let res = await listAgent(this.queryAgentParams)
      this.agentList = res.rows
    },
    /** 查询场站管理列表 */
    getList () {
      this.loading = true
      listStation(this.queryParams).then(response => {
        this.stationList = response.rows
        this.total = response.total
        this.loading = false
      })
    },
    /** 页面初始化 查询所有省份 */
    getAllChildArea (parentId) {
      getAllChildAreaByParentId(parentId).then(response => {
        this.provinceList = response.data
        console.log(this.provinceList)
      })
    },
    // 取消按钮
    cancel () {
      this.open = false
      this.reset()
      //重置搜索条件的省市区值
      this.province = null
      this.city = null
      this.district = null
      this.villageName = null
    },
    // 表单重置
    reset () {
      this.form = {
        id: null,
        createTime: null,
        stationName: null,
        addressInfo: null,
        latitude: null,
        longitude: null,
        regionId: null,
        lastUpdateTime: null,
        status: null,
        version: null,
        provinceId: null,
        province: null,
        cityId: null,
        city: null,
        districtId: null,
        district: null,
        villageName: null,
        isShown: 1
      }
      this.resetForm('form')

    },
    /** 搜索按钮操作 */
    handleQuery () {
      this.queryParams.pageNum = 1
      this.getList()
    },
    /** 重置按钮操作 */
    resetQuery () {
      this.resetForm('queryForm')
      this.queryParams.beginTime = null
      this.queryParams.endTime = null
      this.handleQuery()
    },
    // 多选框选中数据
    handleSelectionChange (selection) {
      this.ids = selection.map(item => item.id)
      this.single = selection.length !== 1
      this.multiple = !selection.length
    },
    /** 新增按钮操作 */
    handleAdd () {
      this.reset()
      this.open = true
      this.title = '添加场站管理'
      this.$nextTick(() => {
        this.id = 'cs'
        //this.initMap()
        //console.log(this.$refs.mapForm.mapheight)
        this.$refs.mapForm.mapheight = (this.$refs.leftFrom.offsetHeight - 90) + 'px'
        this.$refs.mapForm.getMyLocation()
      })
    },
    handleManger(row) {
      this.chargeStationId = row.id
      this.chargeStationName = row.stationName
      this.mangerOpen = true
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.id = row.id
      this.reset()
      let {latitude, longitude} = row
      console.log(latitude, longitude)

      const id = row.id || this.ids
      getStation(id).then(response => {
        this.getLat = latitude
        this.getLng = longitude
        this.form = response.data
        this.form = response.data.chargeStation
        this.form.isShown = response.data.chargeStation.isShown? 1 : 0
        this.provinceList = response.data.provinces
        this.cityList = response.data.city
        this.districtList = response.data.district
        this.villageNameList = response.data.villageName
        this.form.addressInfo = response.data.chargeStation.addressInfo
        this.parentList = [...this.villageNameList,...this.districtList,...this.cityList,...this.provinceList]
        this.handleParent(this.form.regionId)

        this.open = true
        this.title = '修改场站管理'
        this.$nextTick(() => {
          //this.initMap(latitude, longitude)
          this.$refs.mapForm.mapheight = (this.$refs.leftFrom.offsetHeight - 90) +'px'
          this.$refs.mapForm.getMyLocation()
        })
      })


      getAllChildAreaByParentId(this.parentId).then(response => {
        this.provinceList = response.data
        console.log(this.provinceList)
      })

    },

    handleParent(id){
      if (id==0) return
      this.parentList.forEach(item=>{
        if (item.id == id ) {
          this.form[parentStatus[item.regionLevel]] = item.id
          return this.handleParent(item.pid)
        }
      })
    },
    /** 提交按钮 */
    submitForm () {
      this.$refs['form'].validate(valid => {
        if (valid) {
          if (this.form.id != null) {
            updateStation(this.form).then(response => {
              this.$modal.msgSuccess('修改成功')
              this.open = false
              //重置搜索条件的省市区值
              this.province = null
              this.city = null
              this.district = null
              this.villageName = null
              this.getList()
            })
          } else {
            addStation(this.form).then(response => {
              this.$modal.msgSuccess('新增成功')
              this.open = false
              //重置搜索条件的省市区值
              this.province = null
              this.city = null
              this.district = null
              this.villageName = null
              this.getList()
            })
          }
        }
      })
    },
    /** 删除按钮操作 */
    handleDelete (row) {
      const ids = row.id || this.ids
      this.$modal.confirm('是否确认删除场站管理编号为"' + ids + '"的数据项？').then(function () {
        return delStation(ids)
      }).then(() => {
        this.getList()
        this.$modal.msgSuccess('删除成功')
      }).catch(() => {})
    },
    /** 导出按钮操作 */
    handleExport () {
      this.download('business/station/export', {
        ...this.queryParams
      }, `station_${new Date().getTime()}.xlsx`)
    },
    choseProvince: function (e) {
      this.$modal.msgSuccess('666')
    }
  }
}


</script>
<style
  lang="scss"
  scoped>
  .formLine{
    display: flex;
    justify-content: flex-start;
  }
.items {
  width: 100%;
  height: 100%;

  .item {
    width: 100%;
    height: 100%;
  }
  .form_l{
    width: 48%;
  }
  .form_r{
    width: 50%;
  }
}
</style>
